<%-- 
    Document   : pendaftaran_taha
    Created on : Aug 13, 2012, 1:35:57 PM
    Author     : ubuntu
--%>
<%@ include file="/WEB-INF/jsp/include/page_header.jspf" %>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">       
        <%--script src="${pageContext.request.contextPath}/js/jquery-ui.js" type="text/javascript"></script --%>
        <title>Pendaftaran TaHa/TaHa@U</title>
        <script type="text/javascript">
            
            $(document).ready(function () {    

                $("input:text").each( function(el) {
                    $(this).blur( function() {
                        if (!$(this).hasClass('normal_text')){
                            $(this).val( $(this).val().toUpperCase());
                        }                        
                    });
                });

                 
                $( "#poskod" ).autocomplete({
                    source: function( request, response ) {
                        var val = $("#negeri").val();
                        var url = '${pageContext.request.contextPath}/poskod/' + val +'?viewPoskod';
                        $.ajax({
                            url: url,
                            dataType: "text",
                            data: {
                                name_startsWith: request.term
                            },                            
                            success: function( data ) {                                 
                                var splitData =  data.split(",");                               
                                response(splitData);
                            }
                        });
                    }
                }); 
                
                $('#tahapPengajian').change(function(){     
                    $.ajax({
                        type: "GET",
                        data: {
                            tahap_pengajian: $(this).val()
                        },
                        url: "${pageContext.request.contextPath}/taha?getPengajian",
                        success: function (data) {
                            $("#pengajian_partition").html(data);                                    
                        }
                    });                       
                });
                
                $('#jenisSekolah').change(function(){     
                    $.ajax({
                        type: "GET",
                        data: {
                            jenis_sekolah: $(this).val(), 
                            sekolah_negeri : $('#negeriSekolah').val()
                        },
                        url: "${pageContext.request.contextPath}/taha?getSekolah",
                        success: function (data) {
                            $("#sekolah_partition").html(data);                                    
                        }
                    });                       
                });
                
                $('#negeriSekolah').change(function(){     
                    $.ajax({
                        type: "GET",
                        data: {
                            sekolah_negeri :$(this).val(), 
                            jenis_sekolah: $('#jenisSekolah').val()
                        },
                        url: "${pageContext.request.contextPath}/taha?getSekolah",
                        success: function (data) {
                            $("#sekolah_partition").html(data);                                    
                        }
                    });                       
                }); 
                
                $('#poskod').blur(function() {
                    $.ajax({
                        type: "GET",
                        data: {
                            poskod :$(this).val().trim()                             
                        },
                        url: "${pageContext.request.contextPath}/taha?getPoskodDesc",
                        success: function (data) {
                            $("#poskod_desc").val(data); 
                        }
                    });                
                });
            });            
            
            
            function regextest(evt){
                var theEvent = evt || window.event;
                var key = theEvent.keyCode || theEvent.which;
                key = String.fromCharCode( key );                
                var regex = /^[0-9]+$/;
                if( !regex.test(key) ) {
                  theEvent.returnValue = false;
                  if(theEvent.preventDefault) theEvent.preventDefault();
                }
            }
            
            function doSelect(val) {
                if (val == '1') { 
                    $('.1').show();
                    $('.2').hide();
                } else if (val == '2') {
                    $('.2').show();
                    $('.1').hide();
                }                
            }
            function resetAll()
            {
                if(parseInt(${actionBean.taha.umur}) < 18)
                {
                    document.getElementById("alamat1").value="";
                    document.getElementById("alamat2").value="";
                    document.getElementById("alamat3").value="";
                    document.getElementById("negeri").value="";
                    document.getElementById("poskod").value="";
                    document.getElementById("poskod_desc").value="";
                    document.getElementById("emel").value="";
                    document.getElementById("noTel").value="";
                    document.getElementById("jenisSekolah").value="";
                    document.getElementById("negeriSekolah").value="";
                    document.getElementById("sekolah").value="";
                }
                else
                {
                    document.getElementById("alamat1").value="";
                    document.getElementById("alamat2").value="";
                    document.getElementById("alamat3").value="";
                    document.getElementById("negeri").value="";
                    document.getElementById("poskod").value="";
                    document.getElementById("poskod_desc").value="";
                    document.getElementById("emel").value="";
                    document.getElementById("noTel").value="";
                    document.getElementById("universiti").value="";
                    document.getElementById("noPeljar").value="";
                    document.getElementById("jenisPengajian").value="";
                    document.getElementById("tahapPengajian").value="";
                    document.getElementById("jurusan").value="";
                    document.getElementById("fakulti").value="";
                    document.getElementById("tarikhMasuk").value="";
                    document.getElementById("tamat").value="";
                }
            }
            
        </script>
    </head>
    <body>
        <s:messages/>
        <s:errors/> 
        <br/>
        <s:useActionBean beanclass="th.stripes.util.ListUtil" id="listUtil" />
        <s:form action="/taha/register" class="niceform">
            <s:hidden name="taha.jantina.kod"/>
            <s:hidden name="taha.jenisKelab"/>
            <div id="content">
                <div id="logo">
                    <span>
                        <img src="${pageContext.request.contextPath}/images/img/ribbon.png"/>               
                    </span>
                </div>
                <h3>
                    <c:if test="${actionBean.taha.umur < 17}" >
                        <span class="1">Pendaftaran Kelab TaHa</span>
                    </c:if>
                    <c:if test="${actionBean.taha.umur >= 17}" >
                        <span class="2">Pendaftaran Kelab TaHa@U</span>
                    </c:if>
                </h3>


                <!--            <fieldset>
                                <legend >
                <c:if test="${actionBean.taha.umur < 17}" >
                    <span class="1">Pendaftaran Kelab TaHa</span>
                </c:if>
                <c:if test="${actionBean.taha.umur >= 17}" >
                    <span class="2">Pendaftaran Kelab TaHa@U</span>
                </c:if>
            </legend>                -->
<!--                <p>
                    <label>Jenis Kelab :</label>                    
                    ${actionBean.taha.jenisKelab}&nbsp;                    
                </p>-->
                <p>
                    <label>No. Akaun TH :</label>
                    ${actionBean.taha.noAkaun}&nbsp;
                    <s:hidden name="taha.noAkaun"/>
                </p>
                <p>
                    <label>Nama :</label>
                    ${actionBean.taha.nama}&nbsp;
                    <s:hidden name="taha.nama"/>
                </p>
                <p>
                    <label>Tarikh Lahir :</label>
                    <fmt:formatDate value="${actionBean.taha.trhLahir}" pattern="dd/MM/yyyy"/>&nbsp;
                    <s:hidden name="taha.trhLahir"/>
                </p>
                <p>
                    <label>Umur :</label>
                    ${actionBean.taha.umur}&nbsp;
                    <s:hidden name="taha.umur"/>
                </p>
                <p>
                    <label>No. KP Semasa :</label>
                    ${actionBean.taha.noPengenalan}&nbsp;
                    <s:hidden name="taha.noPengenalan"/>
                </p>
                <p>
                    <label>Jantina :</label>
                    ${actionBean.taha.jantina.nama}&nbsp;
                    <s:hidden name="taha.jantina.kod"/>
                </p>
                <p>
                    <label>Alamat Surat Menyurat :</label>
                    <s:text name="taha.alamat1" size="30" id="alamat1" class="required"/>&nbsp;
                </p>
                <p>
                    <label>&nbsp;</label>   
                    <s:text name="taha.alamat2" size="30" id="alamat2" class="required"/>&nbsp;
                </p>
                <p>
                    <label>&nbsp;</label> 
                    <s:text name="taha.alamat3" size="30" id="alamat3"/>&nbsp;
                </p>
                <%--<p>
                    <label>&nbsp;</label>         
                    <s:text name="taha.alamat4" size="30"/>&nbsp;
                </p>--%>                
                <p>
                    <label>Negeri :</label>  
                        <s:select name="taha.negeri.code" id="negeri" class="required">
                            <s:option value="">Sila Pilih</s:option>
                        <c:forEach items="${listUtil.senaraiNegeri}" var="item">
                            <s:option value="${item.code}">${item.code} - ${item.desc}</s:option>
                        </c:forEach>
                    </s:select>&nbsp;
                </p>
                <p>
                    <label>Poskod :</label>    
                    <s:text name="taha.poskod.poskod" size="10" maxlength="5" id="poskod" class="required"/>&nbsp;
                    <s:text name="taha.poskod.nama" id="poskod_desc" readonly="true"/>&nbsp;
                </p>
                <p>
                    <label>No. Tel :</label>    
                    <s:text name="taha.telefon" size="20" maxlength="12" id="noTel" onchange="isInteger(this.value);" onkeypress='regextest(event)'/>&nbsp;
                </p>
                <p>
                    <label>Emel :</label>           
                    <s:text name="taha.email" size="30" class="normal_text" id="emel"/>&nbsp;
                </p>

                <c:if test="${actionBean.taha.umur < 17}" >

                    <div class="1">        
                        <h3><p>Maklumat Persekolahan</p></h3>
                        <p>
                            <label>Kategori Sekolah :</label>
                            <s:select name="taha.jenisSekolah.kod" id="jenisSekolah" class="required">
                                <s:option value="">Sila Pilih</s:option>
                                <c:forEach items="${listUtil.senaraiJenisSekolah}" var="item">
                                    <s:option value="${item.kod}">${item.kod} - ${item.nama}</s:option>
                                </c:forEach>
                            </s:select>
                        </p>
                        <p>
                            <label>Negeri :</label>
                            <s:select name="taha.negeriSekolah.code" id="negeriSekolah" class="required">
                                <s:option value="">Sila Pilih</s:option>
                                <c:forEach items="${listUtil.senaraiNegeri}" var="item">
                                    <s:option value="${item.code}">${item.code} - ${item.desc}</s:option>
                                </c:forEach>
                            </s:select>
                        </p>
                        <p id="sekolah_partition">
                            <label>Sekolah :</label>
                            <s:select name="taha.sekolah.kod" id="sekolah" style="width :350px" class="required">
                                <s:option value="">Sila Pilih</s:option>
                                <c:forEach items="${listUtil.senaraiSekolah}" var="item">
                                    <s:option value="${item.kod}">${item.kod} - ${item.nama}</s:option>
                                </c:forEach>
                            </s:select>
                        </p>
                    </div>
                </c:if>
                <c:if test="${actionBean.taha.umur >= 17}" >

                    <div class="2"> 
                        <h3><p>Maklumat Pengajian </p></h3>

                        <p>
                            <label>Institusi Pengajian :</label>
                            <s:select name="taha.universiti.kod" style="width :400px" class="required" id="universiti">
                                <s:option value="">Sila Pilih</s:option>
                                <c:forEach items="${listUtil.senaraiUniversiti}" var="item">
                                    <s:option value="${item.kod}">${item.kod} - ${item.nama}</s:option>
                                </c:forEach>
                            </s:select>

                        </p>
                        <p>
                            <label>No. Pelajar / Matrik :</label>
                            <s:text name="taha.noMatrik" size="30" class="required" id="noPeljar"/>
                        </p>
                        <p>
                            <label>Jenis Pengajian :</label>
                            <s:select name="taha.jenisPengajian.kod" id="jenisPengajian" class="required">
                                <s:option value="">Sila Pilih</s:option>
                                <c:forEach items="${listUtil.senaraiJenisPengajian}" var="item">
                                    <s:option value="${item.kod}">${item.kod} - ${item.nama}</s:option>
                                </c:forEach>
                            </s:select>
                        </p>
                        <p >
                            <label>Peringkat Pengajian :</label>
                            <s:select name="taha.tahapPengajian.kod" id="tahapPengajian" class="required">
                                <s:option value="">Sila Pilih</s:option>
                                <c:forEach items="${listUtil.senaraiTahapPengajian}" var="item">
                                    <s:option value="${item.kod}">${item.kod} - ${item.nama}</s:option>
                                </c:forEach>
                            </s:select>
                        </p>
                        <p id="pengajian_partition">
                            <label>Jurusan Pengajian :</label>
                            <!--s:text name="taha.jurusanPengajian" size="30"/-->
                            <s:select name="taha.jurusanPengajian.kod" style="width :400px" class="required" id="jurusan">
                                <s:option value="">Sila Pilih</s:option>
                                <c:forEach items="${listUtil.senaraiPengajian}" var="item">
                                    <s:option value="${item.kod}">${item.kod} - ${item.nama}</s:option>
                                </c:forEach>
                            </s:select>
                        </p>
                        <p>
                            <label>Fakulti Pengajian :</label>
                            <!--s:text name="taha.fakultiPengajian" size="30"/-->
                            <s:select name="taha.fakultiPengajian.kod" style="width :400px" class="required" id="fakulti">
                                <s:option value="">Sila Pilih</s:option>
                                <c:forEach items="${listUtil.senaraiFakulti}" var="item">
                                    <s:option value="${item.kod}">${item.kod} - ${item.nama}</s:option>
                                </c:forEach>
                            </s:select>
                        </p>
                        <p>
                            <label>Tarikh Masuk IPT :</label>                            
                            <s:text name="taha.trhmasukIPT" size="20" class="date required" formatType="date" formatPattern="dd/MM/yyyy" id="tarikhMasuk"/>
                        </p>
                        <p>
                            <label>Jangkaan Tamat :</label>                            
                            <s:text name="taha.trhtamatIPT" size="20" class="date required" id="tamat"/>
                        </p>
                    </div>
                </c:if>
                <p align="center">                        
                    <s:submit name="TahaReg_Step3a" value="Seterusnya"  class="button_blockUI"/> &nbsp;
                    <s:button name="reset" value="Isi semula" onclick="resetAll()"/> 
                </p>
            </div>            
        </s:form>
</body>
</html>